<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>剑桥英语</title>
  <link rel="stylesheet" href="css/init.css">
  <link rel="stylesheet" href="css/headerFooter.css">
  <link rel="stylesheet" href="css/userIndex.css">
</head>
<body>
<header class="container clearfix">
  <div class="header">
    <img src="./img/logo.png" width="52px" height="59px" alt="">
    <div class="headerLine"></div>
    <img class="jqlogo" src="./img/logoName.png" width="150px" height="55px" alt="">
    <img class="right rightImg" width="110px" height="33px" src="./img/logoRight.png" alt="">
  </div>
</header>
<div class="headerBg"></div>
<div class="container clearfix ">
  <div class="bread">
    <a href="index.html">首页 > </a><a href="companyIndex.html" class="active">机构报名</a>
    <div class="loginState">
      <span class="loginName">你好，aaa</span>
      <span class="loginAbout"><span id="restPwd"><a href="resetPwd.html" style="color: #F9B100">修改密码</a></span> | <span id="logout">退出</span></span>
    </div>
  </div>
  <div class="titleName">
    <span class="line"></span><span class="name">机构报名</span><span class="line"></span>
  </div>
  <div class="userCon">
    <div class="about">
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;剑桥英语青少版扩展阅读系列丛书引进并改编自Success with Reading英文原版，配套合剑桥英语青少版的进阶式补充阅读教程，每本教程由
      近100篇阅读文章和精心选配的图片、实用的练习题组成。阅读材料全部取自原汁原味的英语文章，学生可以从中学习到地道的英语句法结构和表达
      写紧扣时代潮流，内容符合中学生的学习趣，有助于进一步了解世界万象，同时提高语言能力。
    </div>
    <div style="text-align: center">
      <div class="comTab">
        <div class="active online">远程在线监考考试报名</div>
        <div class="outline">线下自行监考考试报名</div>
      </div>
    </div>
    <div class="about" id="online">
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;剑桥英语青少版扩展阅读系列丛书引进并改编自Success with Reading英文原版，配套合剑桥英语青少版的进阶式补充阅读教程，每本教程由
      近100篇阅读文章和精心选配的图片、实用的练习题组成。阅读材料全
    </div>
    <div class="about" id="outline" style="display: none">
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;剑桥英语青少版扩展阅读系列丛书引进并改编自Success with Reading英文原版，配套合剑桥英语青少版的进阶式补充阅读教程，每本教程由
      近100篇阅读文章和精心选配的图片、实用的练习题组成。阅读材料全1111111111122222222233333
    </div>
    <div class="companyCon flex">
      <div class="companyBlock companyBlock1">
        <div class="comTitle comTitle1">Step 1 报名表格下载</div>
        <div class="comBtn comBtn1"><a  download="http://test.jk.cn?key=1"  style="color: #2E2E2E">点击下载报名表格</a></div>
      </div>
      <div class="companyBlock companyBlock2">
        <div class="comTitle comTitle2">Step 2 上传报名表格</div>
        <div class="comBtn comBtn2"><a href="upload.html" style="color: #2E2E2E">点击上传报名表格</a></div>
      </div>
      <div class="companyBlock companyBlock3">
        <div class="comTitle comTitle3">Step 3 报名状态查询</div>
        <div class="comBtn comBtn3"><a href="signStatus.html" style="color: #2E2E2E">报名状态查询</a></div>
      </div>
    </div>
  </div>
</div>
<div class="userBottom">
  <div class="container clearfix">
    <div class="userBottomTitle">考试最新公告</div>
    <div class="userBlock">
      <p class="userBlockName">2020-12-30 公告</p>
      <div class="userBottomCon clearfix">
        剑桥英语青少版扩展阅读系列丛书引进并改编自英文原版，编自英配套合剑桥英语青少版的进阶式补充阅读教程，每本教程由题材和体裁广泛的近100篇阅读文章和精心选配的图片、实用的练习题组成。阅读材料全剑桥英语青少版扩展阅读系列丛书引进并改编自英文原版，配套合剑桥英语青少版的进阶式补充阅读教程，每本教程由题材和体裁广泛的近100篇阅读文章和精心选配的图片、实用的练习题组成。阅读材料全剑桥英语青少版扩展阅读系列丛书引进并改编自英文原版，配套合剑桥英语青少版的进阶式补充阅读教程，每本教程由题材和体裁广泛的近100篇阅读文章和精心选配的图片、实用的练习题组成。
      </div>
    </div>
    <div class="userBlock">
      <p class="userBlockName">2020-12-30 公告</p>
      <div class="userBottomCon clearfix">
        剑桥英语青少版扩展阅读系列丛书引进并改编自英文原版，题组成。
      </div>
    </div>
  </div>
</div>
<!--<div class="bottomBg1" style="margin-top: -30px"></div>-->
<div class="bottomBg2">
  <div class="container clearfix">
    <div class="bottomBlock bottomBlock1">
      <div class="bottomBlockTitle" style="margin-bottom: 25px">
        <span>我要咨询</span><span class="line"></span><span>Consulting</span>
      </div>
      <a class="bottomBlockName" href="question.html">考试常见问题FAQ</a>
      <a class="bottomBlockName" href="javascript:;">在线课程咨询</a>
      <a class="bottomBlockName" href="javascript:;">商务合作</a>
    </div>
    <div class="bottomBlock bottomBlock2">
      <div class="bottomBlockTitle" style="margin-bottom: 50px">
        <span>在线课程</span><span class="line"></span><span>Online Courses</span>
      </div>
      <a class="bottomBlockName" href="javascript:;">进入课程</a>
    </div>
  </div>
</div>
<footer class="footer clearfix" style="margin-top: 0">
  <div class="container clearfix">
    <div class="footerTitle">剑桥领思中国运营中心</div>
    <div class='footerLeft'>
      <div>客服电话</div>
      <div class="line"><span ></span></div>
      <div class="info"><i class="footerIcon phone"></i>400-100-8565 </div>
      <div style="font-size: 12px">（周一至周日 08:00 – 20:00）</div>
    </div>
    <div class='footerCenter'>
      <div>客服邮箱</div>
      <div class="line"><span></span></div>
      <div class="info"><i class="footerIcon email"></i>service@piloteducation.cn</div>
    </div>
    <div class='footerRight right'>
      <img class="" src="./img/logoName.png" width="175px" height="64px" alt="">
    </div>
  </div>

</footer>
<div class="copyRight">
  京公网安备11011302000942号 <a href="https://beian.miit.gov.cn/" style="color:#fff">ICP备案许可证：京ICP备13031798号-1</a> Copyright 2005 - 2020 领航文化 All Rights Reserved
</div>
<!--退出登录-->
<div class="logoutModel">
  <div class="logoutCon">
    <div><img src="./img/logout.png" alt=""></div>
    <div>您将退出本次登录</div>
    <div><span class="cancel">取消</span><span class="yes">确定</span></div>
  </div>
</div>
<script src="js/jquery-2.1.1.min.js"></script>
<script src="js/common.js"></script>
<script>
  $(document).ready(function(){
    $('.comTab div').click(function () {
      if(!$(this).hasClass('active')){
        $(this).addClass('active').siblings().removeClass('active')
      }
      if($(this).hasClass('online')){
        $('.companyCon').show();
        $('#online').show();
        $('#outline').hide();
      }else{
        $('#online').hide();
        $('#outline').show();
        $('.companyCon').hide();
      }
    })
    var div = $('.userBlock');
    var textArr = [];
    for(var i=0;i<div.length;i++){
      var text = div.eq(i).children('.userBottomCon').html();
      textArr.push(text)
      if(text.length>100){
        div.eq(i).children('.userBottomCon').html(text.substring(0,100)+'...');
        div.eq(i).children('.userBottomCon').append('<span class="arrowIcon" data-index="'+i+'">展开详情<i class="userArrowBottom"></i></span>')
      }else{
        div.eq(i).children('.userBottomCon').append('<span class="arrowIcon" data-index="10000">暂无更多详情</span>')
      }
    }
    $('body').on('click','.arrowIcon',function () {
      var index = parseInt($(this).attr('data-index'));
      console.log(index)
      if(index == 10000){
        return;
      }
      if($(this).children('i').hasClass('userArrowBottom')){
        div.eq(index).children('.userBottomCon').html(textArr[index]+'<span class="arrowIcon" data-index="'+index+'">收起详情<i class="userArrowTop"></i></span>');
      }else{
        var text =  $(this).parent().html().substring(0,100)+'...';
        $(this).parent().html(text+'<span class="arrowIcon" data-index="'+index+'">展开详情<i class="userArrowBottom"></i></span>')
      }
    })
  });
</script>
</body>
</html>
